import theAxios from 'axios'
import router from '@/router'
import Notify from '@/ui/Notify.js'
import { getToken, removeToken, setToken } from './token'
import { getNewTokenAPI } from '@/api'
const axios = theAxios.create({
  baseURL: 'https://geek.itheima.net/',
  timeout: 20000
})
// Add a request interceptor
axios.interceptors.request.use(function (config) {
  // Do something before request is sent
  if (getToken()?.length > 0 && config.headers.Authorization === undefined) {
    config.headers.Authorization = `Bearer ${getToken()}`
  }
  return config
}, function (error) {
  // Do something with request error
  return Promise.reject(error)
})

// Add a response interceptor
axios.interceptors.response.use(function (response) {
  // Any status code that lie within the range of 2xx cause this function to trigger
  // Do something with response data
  return response
}, async function (error) {
  // Any status codes that falls outside the range of 2xx cause this function to trigger
  // Do something with response error
  if (error.response.status === 401) {
    // Notify({ type: 'warning', message: '身份已过期' })
    removeToken()// 先清除token 才能去登录页面

    // 方式1：清除token，强制跳转到登录，用户有感知
    // router.currentRoute 相当于 在 vue文件内this.$route ->当前路由对象信息
    // fullPath 路由对象完整路由路径
    // router.replace(`/login?path=${router.currentRoute.fullPath}`)// 不能使用this.$router(因为this不是vue组件对象无法调用$router)
    // 为了拿到对象，直接引入

    // 方式2：使用refresh_token换回新的token再继续使用，JS代码实现，用户无感知（效果好）
    const res = await getNewTokenAPI()
    // 新的token回来
    // 1.更新token在本地
    setToken(res.data.data.token)
    // 2.更新新的token在请求头里
    error.config.headers.Authorization = `Bearer ${res.data.data.token}`
    // 3.未完成的请求，再次发起
    return axios(error.config)
    // error.config就是上一次请求的配置对象
    // 结果我们要return回原本逻辑页面调用地方-还是return回去一个promise对象
  } else if (error.response.status === 500 && error.config.url === '/v1_0/authorizations' &&
    error.config.method === 'put'
  ) {
    localStorage.clear()// 清除localStorage里所有值
    Notify({ type: 'warning', message: '身份已过期' })
    console.log(router.currentRoute.fullPath)
    router.replace(`/login?path=${router.currentRoute.fullPath}`)// 不能使用this.$router(因为this不是vue组件对象无法调用$router)
  }
  return Promise.reject(error)
})
export default ({ url, method = 'GET', params = {}, data = {}, headers = {} }) => {
  return axios({
    url,
    method,
    params,
    data,
    headers
  })

//   return new Promise((resolve, reject) => {
//     $.ajax({
//       url,
//       data,
//       headers,
//       type: method,
//       success: (res) => {
//         resolve(res)
//       },
//       error: err => {
//         reject(err)
//       }
//     })
//   })
}
